import React, { Component } from "react";
import { withRouter } from "react-router-dom";
import "./index.scss";

class MyBottomMsg extends Component {
  render() {
    const { showMsg, MsgInfo } = this.props;
    const { count, list } = MsgInfo;
    return (
      <div
        className="MyBottomMsgWrapper"
        style={{ display: showMsg ? "" : "none" }}
      >
        <div className="title">
          <span>房屋列表</span>
          <div className="count">
            共&nbsp;<div className="c">{count}</div>&nbsp;套
          </div>
        </div>
        <div className="_list">
          {list.map((item) => {
            return (
              <div
                className="item"
                key={item.houseImg}
                onClick={() => {
                  this.props.history.push("/house-detail/" + item.houseCode);
                  console.log(item);
                }}
              >
                <img src={`http://localhost:8080${item.houseImg}`} alt="" />

                <div className="content">
                  <span className="contentTitle">{item.title}</span>
                  <span className="second">{item.desc}</span>
                  <div className="adviceList">
                    {item.tags.map((one, index) => {
                      return (
                        <div className="adviceItem" key={index}>
                          <span className="adviceText">{one}</span>
                        </div>
                      );
                    })}
                  </div>
                  <span className="price">{item.price}元/月</span>
                </div>
              </div>
            );
          })}
        </div>
      </div>
    );
  }
}

export default withRouter(MyBottomMsg);
